﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="CreateProject.aspx.cs" Inherits="CreateProject" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">

    <script>
        $(function () {
            var select = $("#amount");
            var slide = $("#slider-range-min");
            var hfField = $('#<%=hfAmount.ClientID%>');

            slide.slider({
                range: "min",
                value: hfField.val(),
                min: 1,
                max: 10,
                step: 1,
                slide: function (event, ui) {
                    select.val(ui.value);
                    hfField.val(ui.value);
                }
            });
            select.change(function () {
                var $this = $(this);
                slide.slider("value", $this.val());
                hfField.val($this.val());
            });
            var val = slide.slider('value');
            select.val(val);
            hfField.val(val);

        });


    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">

    <asp:Panel runat="server" DefaultButton="btnForward">

        <asp:HiddenField ID="hfViewState" runat="server" />
        <div class="centerize">
            <h1>
                <asp:Label Text="Oprettelse af Projekt" ID="lblHeaderText" runat="server" />
            </h1>
        </div>
        <asp:MultiView ID="mvCreate" ActiveViewIndex="0" runat="server">

            <!-- Create Projekt section -->
            <asp:View ID="vCreation" runat="server">
                <div id="createProjectWrapper">
                    <div>
                        <asp:Label ID="lblStatus" Style="color: red; font-size: 11px;" runat="server" /><br />

                        <asp:Label ID="lblDivisionName" Text="Område" runat="server" CssClass="img-text" Width="152px"/>
                        <asp:TextBox ID="txtDivisionName" runat="server" Enabled="false" CssClass="txtProject"/><!--Division name-->

                        <asp:Label ID="lblProject" Text="Projekt titel" runat="server" CssClass="img-text" Width="152px" />
                        <asp:TextBox ID="txtProjectTitel"  runat="server" CssClass="txtProject" /><br /><br /><br /><!--Titel-->
                        <asp:Label ID="lblDivergent" runat="server" CssClass="img-text" Width="152px" />
                        <asp:TextBox ID="txtDivergent" CssClass="txtProject" runat="server" /><!--Company or education level-->
                        <asp:Label ID="lblContactName" Text="Kontakt navn" runat="server" CssClass="img-text" Width="152px" />
                        <asp:TextBox ID="txtContactName" CssClass="txtProject" placeholder="For- og efternavn" runat="server"/><br /><br /><!--Contact name-->
                        <div style:"text-align:right">
                            <asp:RegularExpressionValidator ErrorMessage="Må ikke indeholde tegn eller tal!" CssClass="img-text" Width="350px" ForeColor="Red" ControlToValidate="txtContactName"  runat ="server" ValidationExpression="^[ÆØÅæøåa-zA-Z]+(([\'\,\.\- ][ÆØÅæøåa-zA-Z ])?[ÆØÅæøåa-zA-Z]*)*$" />

                        </div>
                        <asp:Label ID="lblEmail" Text="E-mail" runat="server" CssClass="img-text" Width="152px" />
                        <asp:TextBox ID="txtEmail" runat="server" CssClass="txtProject" TextMode="SingleLine" />
                        <asp:Label ID="lblPhoneNo" Text="Tlf. nr." runat="server" CssClass="img-text" Width="152px" /><%--<br />--%>
                        <%--<asp:TextBox ID="txtEmail" runat="server" CssClass="txtProject" TextMode="SingleLine" ud kommenteret for test/>--%>
                        <asp:TextBox ID="txtPhoneNo" runat="server" CssClass="txtProject" /><br /><br />
                        <div>
                            <asp:RegularExpressionValidator ErrorMessage="Ikke gyldig mail!" CssClass="img-text" Width="152px" ForeColor="Red" ControlToValidate="txtEmail" runat="server" ValidationExpression="^([ÆØÅæøåa-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([ÆØÅæøåa-zA-Z0-9\-]+\.)+))([ÆØÅæøåa-zA-Z]{2,4}|[0-9]{1,3})(\]?)$" />
                            <asp:RegularExpressionValidator ErrorMessage="Ikke gyldig nummer!" CssClass="img-text" Width="152px" ForeColor="Red" ControlToValidate="txtPhoneNo" ValidationExpression="^((\(?\+45\)?)?)(\s?\d{2}\s?\d{2}\s?\d{2}\s?\d{2})$" runat="server" />
                        </div>
                        <div id="requirementField" runat="server">
                            <asp:Label ID="lblDemand" Text="Tekniske krav" runat="server" CssClass="img-text" Width="152px" />
                            <asp:TextBox ID="txtRequirements" runat="server" CssClass="txtProject" Width="450px" Height="80px" TextMode="MultiLine" placeholder="Indskriv de tekniske krav i punktform. Max 200 tegn." /><br />
                        </div>
                        <div id="indexWrapper" runat="server" visible="false" class="disciplinaryWrapper">
                            <!--wrap around-->
                            <asp:CheckBoxList ID="cblDivisions" RepeatDirection="Horizontal" AutoPostBack="true" runat="server">
                                <asp:ListItem Text="Business" Value="2" Selected="False" />
                                <asp:ListItem Text="Pædagogik" Value="6" Selected="False" />
                                <asp:ListItem Text="Sundhed" Value="4" Selected="False" />
                                <asp:ListItem Text="Teknologi" Value="3" Selected="False" />
                            </asp:CheckBoxList>
                            </div>
                            <br />
                            
                            <div id="calendarWrapper">
                           
                                <asp:ScriptManager ID="sm1" runat="server" />
                                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                                    <ContentTemplate>
                                        <div class="calendarHeight">
                                <asp:Label ID="lblStart" Text="Start" runat="server" CssClass="img-text" Width="135px" style="text-align: right;" /><br />
                                            <div class="clear"></div>
                                            <asp:Label ID="Label1" Text="Vælg tidsperiode" runat="server" style="font-size:small; float:left;" />
                                            <asp:Calendar ID="calStart" runat="server" DayNameFormat="Shortest" Font-Names="Tahoma" Font-Size="11px" NextMonthText=">" PrevMonthText="<"
                                                SelectMonthText="»" SelectWeekText="›" CssClass="myCalendar" CellPadding="0" OnSelectionChanged="calStart_SelectionChanged">
                                                <OtherMonthDayStyle ForeColor="#b0b0b0" />
                                                <DayStyle CssClass="myCalendarDay"  />
                                                <DayHeaderStyle CssClass="myCalendarDayHeader" ForeColor="#2d3338" />
                                                <SelectedDayStyle Font-Bold="True" Font-Size="12px" CssClass="myCalendarSelector" BackColor="White" />
                                                <TodayDayStyle CssClass="myCalendarToday" />
                                                <SelectorStyle CssClass="myCalendarSelector" />
                                                <NextPrevStyle CssClass="myCalendarNextPrev" />
                                                <TitleStyle CssClass="myCalendarTitle" />
                                            </asp:Calendar>
                                        </div>
                                        <div class="calendarHeight" style="float:right; margin-right:-78px;"> 
                                            <asp:Label ID="lblEnd" Text="Slut" runat="server" CssClass="img-text" Width="160px" style="text-align: center;"/><br />

                                            <asp:Calendar ID="calEnd" runat="server" DayNameFormat="Shortest" Font-Names="Tahoma" Font-Size="11px" NextMonthText=">" PrevMonthText="<"
                                                SelectMonthText="»" SelectWeekText="›" CssClass="myCalendar" CellPadding="0" OnSelectionChanged="calEnd_SelectionChanged">
                                                <OtherMonthDayStyle ForeColor="#b0b0b0" />
                                                <DayStyle CssClass="myCalendarDay" />
                                                <DayHeaderStyle CssClass="myCalendarDayHeader" ForeColor="#2d3338" />
                                                <SelectedDayStyle Font-Bold="True" Font-Size="12px" CssClass="myCalendarSelector" BackColor="White" />
                                                <TodayDayStyle CssClass="myCalendarToday" />
                                                <SelectorStyle CssClass="myCalendarSelector" />
                                                <NextPrevStyle CssClass="myCalendarNextPrev" />
                                                <TitleStyle CssClass="myCalendarTitle" />
                                            </asp:Calendar>
                                        </div>
                                    </ContentTemplate>
                                </asp:UpdatePanel>
                            </div>
                            <br />
                            <div runat="server" id="sliderRanger" class="sliderWrapper"><br />
                                <asp:HiddenField runat="server" ID="hfAmount" />
                                <asp:Label for="amount" Text="Antal reservationer før det låses:" CssClass="img-text" Width="285px" runat="server" />
                                
                                <input class="sliderValue" type="number" id="amount" max="10" min="1" style="border:transparent; border-top:2px solid #f08100; border-radius: 5px; padding-left:12px;" />

                                <div id="slider-range-min" class="txtProject"></div>
                            </div>
                            <br />
                        </div>
                    </div>
            </asp:View>
        </asp:MultiView>
        <!--Knapperne skal lige ændres.. Der skal være tilbage funktion så man kommer tilbage.-->
        <div style="text-align: center; margin-top: 20px;">
            <asp:Button runat="server" ID="btnBackward" OnClick="btnBackward_Click" CssClass="buttonOff"  Text="Tilbage" />
            <asp:Button runat="server" ID="btnForward" OnClick="btnForward_Click" CssClass="buttonOn" Text="Videre" />
        </div>
    </asp:Panel>
</asp:Content>

